vue中使用 v

v-if 和 v-show 可能是vue开发中比较常用的两个指令，虽然看上去两者功能是类似的，但是两者还是存在很大区别的。

在切换 v-if 块时，Vue有一个局部编译/卸载过程，因为 v-if 之中的模板也可能包括数据绑定或子组件。v-if 是真实的条件渲染，因为它会确保条件块在切换当中合适地销毁与重建条件块内的事件监听器和子组件。

v-if 也是惰性的：如果在初始渲染时条件为假，则什么也不做，只有在条件第一次变为真时才开始局部编译（编译会被缓存起来）。

相比之下，v-show 简单得多，元素始终被编译并保留，只是简单地基于 CSS 切换。

一般来说，v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好。

比如说现在很多页面在不同端表现是不同的，最常见的是很多的APP页面在微信端打开时页面上会显示下载的提示，而在APP内部则不会，像这样的情况每个端的状态在加载时就是确定的不会变的就适合用v-if，这样在APP内打开时显示下载的部分直接就不会编译。

而像页面上元素根据不同条件显示/隐藏这样的地方用v-show是最合适的了，因为像这种基本上两个状态要频繁切换，如上面所说，v-show的切换消耗是小于v-if的。

在页面层次结构，数据较多的时候，用v-if或者v-show就会出现div闪现，或者部分闪烁的结果。解决方法：可以在根元素添加v-cloak来解决，并且设置它的css样式即可。